<template>
  <div>
    <!-- table -->
    <a-card :bordered="false" title="$t('helpIndex.bjnr')">
      <a slot="extra" @click="handleClickSave" v-if="!loading">{{ $t('helpIndex.bc') }}</a>
      <div style="margin-bottom:15px;">
        {{ $t('helpIndex.lxsx') }}:
        <a-radio-group @change="handleChangeType" :defaultValue="type">
          <a-radio-button value="buyer">{{ $t('helpIndex.mj') }}</a-radio-button>
          <a-radio-button value="shop">{{ $t('helpIndex.sj') }}</a-radio-button>
        </a-radio-group>
      </div>
      <a-row>
        <a-col :sm="24" :xs="24">
          <a-textarea v-model="data" placeholder="$t('helpIndex.qsr')" :rows="15" />
        </a-col>
      </a-row>
    </a-card>
  </div>
</template>

<script>
import { mixin, mixinDevice } from '@/utils/mixin'

export default {
  name: 'content_bind',
  mixins: [mixin, mixinDevice],
  components: {
  },
  data () {
    return {
      description: '帮助内容编写,支持换行',
      loading: false,
      data: '',
      type: 'buyer',
    }
  },
  created () {
    this.getRow()
  },
  methods: {
    handleClickHideBindInfo () {
      this.showBindInfo = false
    },
    handleClickAdd () {
      this.$refs.createModal.add()
    },
    getRow (type) {
      let url = '/help/get_row'
      if (type !== undefined) {
        url += '?type=' + type
      }
      this.$http.get(url).then(res => {
        this.data = res.content
      }).catch(err => {
        this.$notification.error({
          message: this.$t('helpIndex.sb'),
          description: err.message
        })
      })
    },
    handleClickSave () {
      this.loading = true
      this.$http.post('/help/save', this.$qs.stringify({
        content: this.data,
        type: this.type
      })).then(res => {
        if (res.code === 0) {
          this.$notification.success({
            message: this.$t('helpIndex.cg'),
            description: res.msg
          })
        } else {
          this.$notification.error({
            message: this.$t('helpIndex.sb'),
            description: res.msg
          })
        }
      }).catch(err => {
        this.$notification.error({
          message: this.$t('helpIndex.sb'),
          description: err.message
        })
      }).then(() => {
        this.loading = false
      })
    },
    handleChangeType (e) {
      this.type = e.target.value
      this.getRow(e.target.value)
    },
  }
}
</script>

<style lang="less" scoped>
  .card{
    margin-bottom: 24px;
  }
  .douyin-bind-img{
    margin-bottom:10px;
    text-align: center;
  }
  .douyin-bind-img img{
    width:100px;
    height:100px;
    border-radius: 50%;
  }
</style>
